.theme-BLACK {

  /* work界面 */
  .two_asides {
    width: 100%;
    height: 100%;
    float: left;
    color: #fff;
    // border-right: 1px solid #000;
    border-left: 1px solid #000
  }

  /* 多页签控制 */
  .multiple-page-control-group {
    background-color: #1a1c22;

    .multiple-page-control {

      .el-tabs__header.is-top {
        height: 35px;
        margin: 0;
        border-bottom: 1px solid #000;
        border-top: 2px solid #000;
        overflow: hidden;

        .el-tabs__nav-wrap.is-top {
          height: 35px;

          .el-tabs__nav-scroll {
            height: 35px;

            .el-tabs__nav.is-top {
              height: 35px;
              border: none;

              .el-tabs__item {
                height: 35px;
                line-height: 35px;
                padding: 0 10px;
                color: #999;
                border-bottom: none;
                border-left: none;
                border-right: 1px solid #000;

                span {
                  max-width: 140px;
                  display: inline-block;
                  overflow: hidden;
                  white-space: nowrap;
                  text-overflow: ellipsis;
                }

                .el-icon-close {
                  top: -13px;
                }
              }

              .el-tabs__item:hover {
                // background-color: #2e3139;
                background-color: #0c82b0;
                color: #fff;

              }

              .el-tabs__item.is-active {
                // background-color: #2e3139;
                background-color: #0c82b0;
                color: #fff;
              }
            }


          }
        }
      }
    }
  }

  .multiple-page-control-body {
    height: 100%;
    overflow: hidden;
  }



  /* dialog */
  .el-dialog__wrapper {}

  .el-dialog {
    .el-dialog__header {
      background-color: #27292e;
      color: #fff;
      line-height: 1;
      padding: 14px 13px;

      .el-dialog__headerbtn {
        top: 14px;
        right: 13px
      }


    }

    .el-dialog__title {
      color: #fff
    }

    .el-dialog__body {
      background-color: #1d1e22;
      padding: 0px 0px 1px 0px;

      .add_db_fliter {
        background-color: #131111;
        padding: 18px 50px 0 50px;
        height: 60px;

        .el-input {
          .el-input__inner {
            height: 28px;
            line-height: 28px;
          }
        } .el-button {
          position: absolute;
          right: 0;
        }
      }

      .add_db_con {
        height: 250px;
        overflow: hidden;

        .fl {
          height: 250px;
          overflow: auto;
        }

        .item {
          height: 25px;
          line-height: 25px;
          background-color: #27292e;
          color: #B4B4B4;
          font-size: 14px;
          width: 100px;
          padding-left: 20px;
          cursor: pointer;
        }

        .item:hover {
          background-color: #1d1e22;
          color: #fff;
        }

        .active {
          background-color: #1d1e22;
          color: #fff;
        }

        .db_list {
          padding-left: 120px;

          .list_item {
            margin-right: 20px;
            margin-bottom: 10px;
            float: left;
            color: #B4B4B4;
            cursor: pointer;
            text-align: center;

            .img {
              width: 90px;
              height: 60px;
              margin-bottom: 5px;
            }

          }

          .list_item.active {
            color: #fff;
          }
        }
      }

      .add_db_ver {
        background-color: #27292e;
        color: #B4B4B4;
        height: 30px;
        line-height: 30px;
        padding-left: 20px;
        border-bottom: 1px solid #1d1e22;
        border-top: 1px solid #1d1e22;

        // .el-select {
        //   .el-input.el-input--suffix {
        //     height: 25px;
        //     line-height: 25px;

        //     .el-input__suffix {
        //       top: 8px;

        //     }
        //   }
        // }
      }
    }

    .el-dialog__footer {
      background-color: #27292e;
      text-align: center;
      padding: 10px 0 10px 0;

      .dialog-footer {}
    }


  }

  // .el-select {
  //   .el-input.el-input--suffix {
  //     height: 25px;
  //     line-height: 25px;

  //     .el-input__suffix {
  //       top: 8px;

  //     }
  //   }
  // }

  /* form表单 */
  .el-form {
    .el-form-item {

      .el-form-item__label {
        line-height: 25px;
      }

      .el-form-item__content {
        min-height: 25px;
        line-height: 25px;
      }
    }
  }

  /* 时间控件 */
  .el-date-editor.el-input.el-input--prefix.el-input--suffix.el-date-editor--time {
    .el-input__prefix {
      top: -7px;
    }

    .el-input__suffix {
      top: -7px;
    }
  }

  /* input */
  .el-input {
    .el-input__inner {
      // height: 25px;
      // line-height: 25px;
      background-color: #27292e;
      border: none;
      color: #999;
    }

    .el-input__inner:focus {
      background-color: #131415;
      color: #fff;
    }
  }

  /* 下拉菜单 */
  .el-dropdown-menu {
    background-color: #131415;
    border: none;

  }

  .el-dropdown-menu__item:focus,
  .el-dropdown-menu__item:not(.is-disabled):hover {
    background-color: #27292e;
  }

  .el-popper[x-placement^=bottom] .popper__arrow {
    // border-color: #131415;
  }

  .el-popper[x-placement^=bottom] .popper__arrow::after {
    // background-color: #131415;
    top: 0px;
  }

  /* 多选框 */
  .el-checkbox {
    .el-checkbox__input {
      .el-checkbox__inner {
        background-color: #11141a;
        border: 1px solid #27292e;
      }
    }

    .el-checkbox__input.is-checked {

      .el-checkbox__inner {
        background-color: #409EFF;
        border-color: #409EFF;

      }

      +.el-checkbox__label {
        color: #fff;
      }
    }

  }

  /* 分页 */
  .el-pagination {
    .btn-prev {
      background-color: #34363c;
    }

    .el-pager {
      li:not(.disabled).number.active {
        background-color: #007aff;
      }

      .number {
        background-color: #34363c;
      }
    }

    .btn-next {
      background-color: #34363c;
    }
  }

  /* 表格 */
  .el-table {
    color: #fff;
    background-color: #27292e;

    .el-table__header-wrapper {
      .el-table__header {
        .has-gutter {
          color: #ccc;
        }
      }
    }

    .el-table__body-wrapper {
      .el-table__body {
        .el-table__row {
          height: 45px;

          td {
            border-color: #000;
          }
        }

        tr.current-row>td {
          background-color: #3d3f44;

        }

      }
    }


  }

  .el-table--border,
  .el-table--group {
    border: none;
  }

  .el-table--border td {
    border-right: none;
    border-bottom: none;
  }

  .el-table--border th {
    border-right: none;
    border-bottom: none;
  }

  .el-table th.is-leaf {
    border-bottom: none;
  }

  .el-table tr {
    background-color: #27292e;
  }

  .el-table td {
    padding: 0;
  }



  .el-table th {
    padding: 6px 0;
    background-color: #3d3f44;
  }

  .el-table--border::after,
  .el-table--group::after {
    right: -1px;
  }

  .el-table::before {
    top: -1px;
  }

  .el-table--enable-row-hover .el-table__body tr:hover>td {
    background-color: #3d3f44;
  }

  .el-table__body tr.current-row>td,
  .el-table__body tr.hover-row>td,
  .el-table__body tr.current-row.hover-row>td {
    background-color: #3d3f44;
  }

  .el-table__fixed-right::before,
  .el-table__fixed::before {
    top: -1px;
  }

  .el-table__fixed-right-patch {
    right: 30px;
  }

  .el-table__body-wrapper::-webkit-scrollbar {
    width: 10px;
    height: 10px;

    background-color: #27292e;
  }

  .el-table--border th.gutter:last-of-type {
    border-bottom: none;
  }

  .el-table__body-wrapper::-webkit-scrollbar-thumb {
    background-color: #333;
    border-radius: 5px;
  }

  .el-table__empty-block {
    background-color: #16171c;
  }

  .el-table,
  .el-table__expanded-cell {
    background-color: #27292e;
  }

  /* textarea样式 */
  .el-textarea {
    .el-textarea__inner {
      height: 60px;
      border: none;
      background-color: #27292e;

    }

    .el-textarea__inner:focus {
      border: none;
      color: #fff;
      background-color: #131415;

    }

    .el-textarea__inner::-webkit-scrollbar {
      width: 10px;
      height: 10px;
    }

    .el-textarea__inner::-webkit-scrollbar-thumb {
      background-color: #333;
      border-radius: 5px;
    }
  }

  .el-textarea.is-disabled {
    .el-textarea__inner {
      background-color: #27292e;
      border: none;
      color: #999;
      cursor: not-allowed;
    }
  }

  /* 加载界面 */
  .el-loading-mask {
    background-color: #000;
    opacity: 1;
  }
}

/* 选择器下拉框 */

.theme-BLACK {

  .el-select-dropdown.el-popper {
    border: 1px solid #1d1e22;
    background-color: #27292e;

    .el-scrollbar {
      background-color: #27292e;

      .el-select-dropdown__wrap.el-scrollbar__wrap {
        .el-select-dropdown__item {}

        .el-select-dropdown__item:hover {
          background-color: #1d1e22 !important;
          color: #fff;
        }

        .el-select-dropdown__item.selected {
          color: #fff;
          background-color: #1d1e22;
        }

        .el-select-dropdown__item.hover {
          color: #fff;
          background-color: #1d1e22;
        }
      }
    }

    .popper__arrow {
      // background-color: #1d1e22;
      border-bottom-color: #1d1e22;
    }

    .popper__arrow:after {

      border-bottom-color: #1d1e22;
    }

  }

}

/* 拖动 */
.el-main {
  .splitpanes.default-theme {
    .splitpanes__pane {
      background-color: #27292e;
    }

    /* 控制左侧拖动线 */
    .splitpanes__splitter {
      background-color: #000;
      border: none;
      width: 1px;
      position: relative;
    }

    .splitpanes__splitter:before {
      content: '';
      position: absolute;
      left: -8px;
      top: 0;
      width: 20px;
      height: 0%;
      transition: opacity 0.4s;
      opacity: 0;
      z-index: 1;
      background-color: #000;
    }

    .splitpanes__splitter:hover:before {
      opacity: 1;

    }

    .splitpanes__splitter:after {
      content: '';
      position: absolute;
      left: -10px;
      bottom: 0;
      width: 20px;
      height: 80%;
      transition: opacity 0.4s;
      opacity: 0;
      z-index: 1;
      background-color: #000;

    }

    .splitpanes__splitter:hover:after {
      opacity: 1;

    }

  }
}